<html>
<head>
	<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
	<title>webslideshow.options.title</title>

	<link href="ContextMenu/ContextMenu.css" rel="stylesheet" type="text/css">

	<style TYPE="text/css">
		BODY {
			background: #ece9d8;
			padding: 5px;
			overflow: hidden;
			font-size: 14px;
		}
		TABLE {
			font-size: 14px;
		}
		#tabs {
			background: white;
			padding: 10px;
			width: 100%;
			height: 100%;
			border: 1px solid #919b9c;
		}
		#tab_options {
			width: 100%;
			height: 100%;
		}
		#tab_rules {
			display:none;
			width: 100%;
			height: 100%;
			min-height:200px;
		}
		#rules_tree {
			width:100%;
		}
		.SelectedOptionsTab {
			background: #fcfcfe;
			border: 1px solid #919b9c;
			border-bottom-color: #fcfcfe;
			border-top-color: #ff9933;
			border-top-width: 2px;
		}
		.UnSelectedOptionsTab {
			background: #f0f0ea;
			border: 1px solid #91a7b4;
			border-bottom-color: #f0f0ea;
			border-right-color: #f0f0ea;
		}
		.SelectedRulesTab {
			margin-left: -4px;
			background: #fcfcfe;
			border: 1px solid #919b9c;
			border-bottom-color: #fcfcfe;
			border-top-color: #ff9933;
			border-top-width: 2px;
		}
		.UnSelectedRulesTab {
			margin-left: -3px;
			background: #f0f0ea;
			border: 1px solid #91a7b4;
			border-bottom-color: #f0f0ea;
			border-left-color: #f0f0ea;
		}
		div.tree_container {
			clear: both;
			border: 1px solid #7f9db9;
			overflow: auto;
			height: expression(offsetParent.clientHeight - 30);
			width: 100%;
			min-height: 100px;
		}
		/* define width of table. IE browsers only                 */
		div.tree_container table {
			float: left;
			width: 100%;
		}
		thead.fixed_header tr {
			position: relative;
			top: expression(offsetParent.scrollTop);
		}
		thead.fixed_header th {
			background: #ebeadb;
			font-weight: normal;
			padding: 4px 3px;
			text-align: left
		}
		.minTagHeight {
			clear: right;
			float:right;
			height: 300px;
			width:1px;
		}
		.minTabWidth {
			width: 700px;
			height:1px;
		}
		.treeSelectedRow {
			background: #316ac5;
			color: white;
		}
		.treeDisabledRow {
			color: gray;
		}
		.treeRow {
			color: black;
		}
	</style>

	<script src="ContextMenu/ContextMenu.js" language="jscript" type="text/jscript"></script>
	<script src="factory/ComponentsFactory.js" language="jscript" type="text/jscript"></script>
	<script src="factory/Factory.js" language="jscript" type="text/jscript"></script>
	<script src="Logger.js" language="jscript" type="text/jscript"></script>
	<script src="ResourceBundle.js" language="jscript" type="text/jscript"></script>
	<script src="Configuration.js" language="jscript" type="text/jscript"></script>
	<script src="util/BrowserDependent.js" language="jscript" type="text/jscript"></script>
	<script src="util/KeyboardHelper.js" language="jscript" type="text/jscript"></script>
	<script src="util/Util.js" language="jscript" type="text/jscript"></script>
	<script src="util/Prompt.js" language="jscript" type="text/jscript"></script>
	<script src="util/SimpleXMLHelper.js" language="jscript" type="text/jscript"></script>
	<script src="util/WebNavigationHelper.js" language="jscript" type="text/jscript"></script>
	<script src="util/HTMLContentHelper.js" language="jscript" type="text/jscript"></script>
	<script src="util/ObserverServiceHelper.js" language="jscript" type="text/jscript"></script>
	<script src="WindowManager.js" language="jscript" type="text/jscript"></script>
	<script src="WebProfiles.js" language="jscript" type="text/jscript"></script>
	<script src="WebProfiles.impl.js" language="jscript" type="text/jscript"></script>
	<script src="WebProfilesMergeHelper.js" language="jscript" type="text/jscript"></script>
	<script src="RulesImportManager.js" language="jscript" type="text/jscript"></script>
	<script src="RuleTree.js" language="jscript" type="text/jscript"></script>
	<script src="Options.js" language="jscript" type="text/jscript"></script>
	<script language="jscript" type="text/jscript">
	    var windowManager = null;
		try
		{
			windowManager = wsshWindowManager.getManager();
		}
		catch(e) {}

		function onPageLoad()
		{
			document.getElementById("tabs").selectedIndex = 0;
			onLoad();

			var btCancel = document.getElementById("button-cancel");
			var btOK = document.getElementById("button-ok");
			if (btOK && btCancel && btCancel.clientWidth)
			    btOK.style.width = btCancel.clientWidth + "px";

			try
			{
				windowManager.clearDialogTitle(window);
				windowManager.setDialogStatus(window, document.title);
			}
			catch(e) {}
		}
		function onlyNumbers()
		{
			return /[\d\x00\x08]/.test(String.fromCharCode(window.event.keyCode));
		}
		function SelectOptionsTab()
		{
			document.getElementById("tab_rules").style.display = "none";
			document.getElementById("tab_options").style.display = "inline";
			document.getElementById("OptionsTabButton").className = "SelectedOptionsTab";
			document.getElementById("RulesTabButton").className = "UnSelectedRulesTab";
			document.getElementById("tabs").selectedIndex = 0;
		}
		function SelectRulesTab()
		{
			document.getElementById("tab_options").style.display = "none";
			document.getElementById("tab_rules").style.display = "inline";
			document.getElementById("OptionsTabButton").className = "UnSelectedOptionsTab";
			document.getElementById("RulesTabButton").className = "SelectedRulesTab";
			document.getElementById("tabs").selectedIndex = 1;
		}
		function onTableClick()
		{
			var target = window.event.srcElement;
			var tr = yrprxHTMLContentHelper.getParentWithTag(target, "TR");
			if (!tr && target.tagName == "TR")
				tr = target;
			if (!tr)
				return;

			selectTreeNode(gRuleTreeView.findRowIndex(tr));
		}
		function onTableKeypress()
		{
			var activeElement = document.activeElement;
			if (!yrprxHTMLContentHelper.hasParentWithId(activeElement, "tree_container"))
				return true;

			var event = window.event;
			var keyCode = event.keyCode;

			if (keyCode == yrprxKeyboardHelper.VK_UP && !event.ctrlKey)
				selectTreeNode(gRuleTree.currentIndex-1);
			else if (keyCode == yrprxKeyboardHelper.VK_DOWN && !event.ctrlKey)
				selectTreeNode(gRuleTree.currentIndex+1);
			else if (keyCode == yrprxKeyboardHelper.VK_F4 || keyCode == yrprxKeyboardHelper.VK_INSERT)
			{
				if (event.ctrlKey && event.altKey)
					return !onKeyPressInTree(event);

				windowManager.ResendKey(window, keyCode, event.shiftKey || event.shiftLeft, true, true);
				return true;
			}
			else 
				return !onKeyPressInTree(event);

			return false;
		}
		function onContextMenu()
		{
			onTableClick();
			onPopupContext();
			contextmenuProcessHidden('tree_menu');
			return contextmenuShowMenu('tree_menu');
		}
		function hideContextMenu()
		{
			return contextmenuHideMenu('tree_menu');
		}
		function defaultForInput()
		{
			var active = document.activeElement;
			return active && "INPUT" == active.tagName;
		}
	</script>
</head>
<body onload="onPageLoad();" onkeydown="hideContextMenu();return onTableKeypress();" onclick="hideContextMenu();" oncontextmenu="hideContextMenu();return defaultForInput();" onselectstart="return defaultForInput();">
	<div id=tree_menu class='context_menu'>
		<table class='context_menu' onmouseover="contextmenuOnMouseOver();" onmouseout="contextmenuOnMouseOut();" border=1 cellspacing=0 cellpadding=1>
			<tr id="context-add" onClick='hideContextMenu();onAddRule();'>
				<td class='context_menu_image'>&nbsp;</td>
				<td>webslideshow.options.rules.add</td>
				<td>Ins</td>
			</tr>
			<tr id="context-clone" onClick='hideContextMenu();onCloneRule();'>
				<td class='context_menu_image'>&nbsp;</td>
				<td>webslideshow.options.rules.popup.clone</td>
				<td>Shift+Ins</td>
			</tr>
			<tr id="context-edit" onClick='hideContextMenu();onEditRule();'>
				<td class='context_menu_image'>&nbsp;</td>
				<td>webslideshow.options.rules.popup.edit</td>
				<td>F4</td>
			</tr>
			<tr id="context-remove" onClick='hideContextMenu();removeRule();'>
				<td class='context_menu_image'>&nbsp;</td>
				<td>webslideshow.options.rules.popup.remove</td>
				<td>Del</td>
			</tr>
			<tr id="context-move-separator">
				<td class='context_menu_image' style="padding:0;">&nbsp;</td>
				<td style="padding:0;" colspan="2"><hr></td>
			</tr>
			<tr id="context-move-up" onClick='hideContextMenu();moveRuleUp();'>
				<td class='context_menu_image'>&nbsp;</td>
				<td>webslideshow.options.rules.popup.move.up</td>
				<td>Ctrl+webslideshow.options.up.arrow</td>
			</tr>
			<tr id="context-move-down" onClick='hideContextMenu();moveRuleDown();'>
				<td class='context_menu_image'>&nbsp;</td>
				<td>webslideshow.options.rules.popup.move.down</td>
				<td>Ctrl+webslideshow.options.down.arrow</td>
			</tr>
		</table>
	</div>

	<table style="width: 100%;height: 100%;" cellpadding="0" cellspacing="0">
	<tr valign="bottom"><td>
		<input type="button" id="OptionsTabButton" class="SelectedOptionsTab" onclick="SelectOptionsTab();" value="webslideshow.options.options">
		<input type="button" id="RulesTabButton"   class="UnSelectedRulesTab" onclick="SelectRulesTab();"   value="webslideshow.options.rules">
	</td></tr>
	<tr><td style="height: 100%;">
		<div class="minTagHeight"></div>
		<div id="tabs">
			<div id="tab_options">
				<fieldset style="width:100%;">
					<legend>webslideshow.options.group.slideshow</legend>
					<input type="checkbox" id="auto_start" checked>webslideshow.options.auto.start<br>
					<input type="checkbox" id="repeat">webslideshow.options.repeat<br>
					<input type="checkbox" id="panel_usage">webslideshow.options.minimal.panel.usage<br>
					<table>
						<tr valign="middle">
							<td>webslideshow.options.delay</td>
							<td><input type="text" id="delay" maxlength="5" size="6" style="text-align: right;" onkeypress='return onlyNumbers();'></td>
							<td>webslideshow.options.sec</td>
							<td>webslideshow.options.delay.description</td>
						</tr>
						<tr valign="middle">
							<td>webslideshow.options.min.size</td>
							<td><input type="text" id="min_size" maxlength="4" size="6" style="text-align: right;" onkeypress='return onlyNumbers();'></td>
							<td>webslideshow.options.px</td>
							<td>webslideshow.options.min.size.description<br>webslideshow.options.min.size.warning</td>
						</tr>
					</table>
				</fieldset>
				<table style="width:100%;">
					<tr>
						<td style="width:40%;height:100%;">
							<fieldset style="width:100%;height:100%;">
								<legend>webslideshow.options.group.auto.size</legend>
								<input type="checkbox" id="shrink" checked>webslideshow.options.shrink<br>
								<input type="checkbox" id="zoom" checked>webslideshow.options.zoom<br>
							</fieldset>
						</td>
						<td style="width:60%;height:100%;">
							<fieldset style="width:100%;height:100%;">
								<legend>webslideshow.options.group.viewer</legend>
								<table>
									<tr valign="middle">
										<td>webslideshow.options.scroll.step</td>
										<td><input type="text" id="scroll_step" maxlength="4" size="5" style="text-align: right;" onkeypress='return onlyNumbers();'></td>
										<td>webslideshow.options.px</td>
										<td>webslideshow.options.scroll.step.description</td>
									</tr>
									<tr valign="middle">
										<td>webslideshow.options.zoom.step</td>
										<td><input type="text" id="zoom_step" maxlength="4" size="5" style="text-align: right;" onkeypress='return onlyNumbers();'></td>
										<td>webslideshow.options.percent</td>
										<td>webslideshow.options.zoom.step.description</td>
									</tr>
								</table>
							</fieldset>
						</td>
					</tr>
				</table>
				<fieldset style="width:100%;">
					<legend>webslideshow.options.group.miscellaneous</legend>
					<input type="checkbox" id="fullscreen_image_links" checked>webslideshow.options.fullscreen.image.links
				</fieldset>
			</div>
			<div id="tab_rules">
				<div id="tree_container" class="tree_container" oncontextmenu="return onContextMenu();">
				<table id="rules_tree" cellpadding="2" cellspacing="0">
				<thead class="fixed_header">
					<tr>
						<th align="center" style="border-right:1px solid darkgray;border-bottom:1px solid darkgray;width:20%">
							<NOBR>&nbsp;&nbsp;&nbsp;<strong>Domain</strong>&nbsp;&nbsp;&nbsp;</NOBR>
						</th>
						<th align="center" style="border-right:1px solid darkgray;border-bottom:1px solid darkgray;width:40%">
							<NOBR>&nbsp;&nbsp;&nbsp;<strong>Page Pattern</strong>&nbsp;&nbsp;&nbsp;</NOBR>
						</th>
						<th align="center" style="border-bottom:1px solid darkgray;width:40%">
							<NOBR>&nbsp;&nbsp;&nbsp;<strong>Image Pattern</strong>&nbsp;&nbsp;&nbsp;</NOBR>
						</th>
					</tr>
				</thead>
				<tbody id="rules_treechildren" class="scrollContent" onclick="onTableClick();">
				</tbody>
				</table>
				</div>
				<nobr>
					<input type="button" id="add-rule"    value="webslideshow.options.rules.add"    onclick="onAddRule()">
					<input type="button" id="import-rule" value="webslideshow.options.rules.import" onclick="onImportRule()">
					<input type="button" id="export-rule" value="webslideshow.options.rules.export" onclick="onExportRule();">
				</nobr>
			</div>
		</div>
	</td></tr>
	<tr><td align="right" valign="bottom" style="padding:4px;">
	<div class="minTabWidth">
		<input id="button-ok"     type="button" value="webslideshow.options.button.ok"     onclick='if (onOK()) yrprxBrowser.closeWindow();'>
		<input id="button-cancel" type="button" value="webslideshow.options.button.cancel" onclick='yrprxBrowser.closeWindow();'>
		<input id="button-help"   type="button" value="webslideshow.options.button.help"   onclick='onHelp();'>
	</div>
	</td></tr>
	</table>
</body>
</html>